<template>
  <div>
    <el-dialog
      :title="title"
      :visible="dialogVisible"
      :before-close="handleClose"
    >
      <div>
        <h3 style="text-align: center">{{ assistDetail.title }}</h3>
        <el-descriptions
          :column="2"
          label-class-name="my-label"
          content-class-name="my-content"
        >
          <el-descriptions-item :span="2" label="求助地点">
            {{ assistDetail.location }}
          </el-descriptions-item>

          <el-descriptions-item :span="1" label="求助人">
            {{ assistDetail.publisherName }}
          </el-descriptions-item>
          <el-descriptions-item :span="1" label="协助人">
            {{ assistDetail.assistantName }}
          </el-descriptions-item>

          <el-descriptions-item :span="1" label="报酬">
            {{ assistDetail.reward }}￥
          </el-descriptions-item>
          <el-descriptions-item :span="1" label="协助时间">
            {{ assistDetail.createTime }}
          </el-descriptions-item>
          <el-descriptions-item
            v-show="isDetail || isVerify"
            :span="2"
            label="协助说明"
          >
            {{ assistDetail.assistInfo }}
          </el-descriptions-item>
          <el-descriptions-item v-show="isDetail" :span="2" label="审核说明">
            {{ assistDetail.verifyInfo }}
          </el-descriptions-item>
        </el-descriptions>

        <div v-show="!isDetail" style="margin-top:20px">
          <h3>填写{{ isFinish ? "协助" : "审核" }}信息</h3>
          <el-input v-model="info" type="textarea" :rows="3"></el-input>
        </div>
        


        <span v-show="!isVerify" slot="footer" class="dialog-footer">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="primary" @click="clickConfirm">确 定</el-button>
        </span>
        <span v-show="isVerify" slot="footer" class="dialog-footer">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="success" @click="clickVerify(true)"
            >通&emsp;过</el-button
          >
          <el-button type="warning" @click="clickVerify(false)"
            >不通过</el-button
          >
        </span>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "Assistverifydialog",

  data() {
    return {
      info: "",
    };
  },
  props: {
    dialogVisible: false,
    title: "",
    assistDetail: {},
    handleClose: function () {},
    isFinish: false,
    isDetail: true,
    isVerify: false,
  },

  mounted() {},

  methods: {
    clickVerify(status) {
        this.$emit('verify', status);

    },
    clickConfirm() {
      this.$emit("confirm");
    },
    // close(){
    //   this.$emit('close');
    // }
  },
  watch: {
    info() {
      this.$emit("infoChange", this.info);
    },
  },
};
</script>

<style scoped>
.el-button {
  margin-top: 0px !important;
}
.el-descriptions {
  margin-top: 0px;
}
.dialog-footer {
  text-align: center;
  width: 100%;
  display: flex;
  justify-content: center;
}
.el-dialog .el-button {
  margin: 20px !important;
}
h3 {
  margin-bottom: 15px;
}
</style>